﻿<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<meta charset="utf-8">
	<title>登录页</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
	<meta name="description" content="">
	<meta name="author" content="">
	<!-- STYLESHEETS --><!--[if lt IE 9]><script src="js/flot/excanvas.min.js"></script><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script><![endif]-->
	<link rel="stylesheet" type="text/css" href="resources/admin/css/cloud-admin.css" >

	<link href="resources/admin/font-awesome/css/font-awesome.min.css" rel="stylesheet">
	<!-- DATE RANGE PICKER -->
	<link rel="stylesheet" type="text/css" href="resources/admin/js/bootstrap-daterangepicker/daterangepicker-bs3.css" />
	<!-- UNIFORM -->
	<link rel="stylesheet" type="text/css" href="resources/admin/js/uniform/css/uniform.default.min.css" />
	<!-- ANIMATE -->
	<link rel="stylesheet" type="text/css" href="resources/admin/css/animatecss/animate.min.css" />
	<!-- FONTS -->

</head>
<body class="login">
	<!-- PAGE -->
	<section id="page">
			<!-- HEADER -->
			<header>
				<!-- NAV-BAR -->
				<div class="container">
					<div class="row">
						<div class="col-md-4 col-md-offset-4">
							<div id="logo">
								<a href="index.html"><img src="resources/admin/img/logo/logo-alt.png" height="40" alt="logo name" /></a>
							</div>
						</div>
					</div>
				</div>
				<!--/NAV-BAR -->
			</header>
			<!--/HEADER -->
			<!-- LOGIN -->
			<section id="login" class="visible">
				<div class="container">
					<div class="row">
						<div class="col-md-4 col-md-offset-4">
							<div class="login-box-plain">
								<h2 class="bigintro">登 录</h2>
								<div class="divide-40"></div>
								<form role="form" action="" method="post">
								  <div class="form-group">
									<label for="exampleInputEmail1">用户名：</label>
									<i class="fa fa-envelope"></i>
									<input type="text" class="form-control" id="exampleInputEmail1" name="username" value="<?php if(!empty($_COOKIE['username'])){echo $_COOKIE['username'];}else{echo '';}?>" >

								  </div>
								  <div class="form-group">
									<label for="exampleInputPassword1">密码：</label>
									<i class="fa fa-lock"></i>
									<input type="password" class="form-control" id="exampleInputPassword1" name="password" value="<?php if(!empty($_COOKIE['password'])){echo $_COOKIE['password'];}else{echo '';}?>" >
								  </div>
						    	  <div class="form-group">
									<label for="exampleInputPassword1" style="float:left;line-height: 30px;">验证码:</label><input type="text" class="form-control" id="exampleInputPassword1" name="pin" style="width:100px; float:left" >
									<img  class="pin" src="index.php?c=admin&a=pin&admin=1" style="display: block;" >
								  </div>

								  <div class="form-actions">
									<label class="checkbox">

											<input type="checkbox" class="uniform" name="check" <?php if(!empty($_COOKIE['username'])){echo 'checked';}?>   >记住选择


									</label>
									<label class="checkbox">

										    <input type="checkbox" class="uniform"  name="auto" <?php if(!empty($_COOKIE['auto'])){echo 'checked';}?>>自动登录


									</label>
									<button type="submit" class="btn btn-danger">提交</button>
								  </div>
								</form>
								<!-- SOCIAL LOGIN -->
								<div class="divide-20"></div>
								<div class="center">
									<strong>Or login using your social account</strong>
								</div>
								<div class="divide-20"></div>
								<div class="social-login center">
									<a class="btn btn-primary btn-lg">
										<i class="fa fa-facebook"></i>
									</a>
									<a class="btn btn-info btn-lg">
										<i class="fa fa-twitter"></i>
									</a>
									<a class="btn btn-danger btn-lg">
										<i class="fa fa-google-plus"></i>
									</a>
								</div>
								<!-- /SOCIAL LOGIN -->
								<div class="login-helpers">
									<a href="#" onclick="swapScreen('forgot');return false;">忘记密码?</a> <br>
									Don't have an account with us? <a href="#" onclick="swapScreen('register');return false;">立即注册！</a>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!--/LOGIN -->
			<!-- REGISTER -->
			<section id="register">
				<div class="container">
					<div class="row">
						<div class="col-md-4 col-md-offset-4">
							<div class="login-box-plain">
								<h2 class="bigintro">注册</h2>
								<div class="divide-40"></div>
								<form role="form" action="index.php?c=admin&a=register&admin=1" method="post" name="register">
									  <div class="form-group">
										<label for="name">昵称<label  style="color:red;font-size:12px;">*(必填)</label></label>
										<i class="fa fa-font"></i>
										<input type="text" class="form-control" id="name"  name="nikec">

										<label class="style" style="color:red;font-size:12px;"></label>
									  </div>
									  <div class="form-group">
										<label for="username">邮箱<label  style="color:red;font-size:12px;">*(必填)<label  style="color:#A9A6A6;font-size:12px;">* ajax@**.**格式</label></label></label>
										<i class="fa fa-user"></i>
										<input type="text" class="form-control" id="emaile" name="emaile">
										<label class="style1" style="color:red;font-size:12px;"></label>
									  </div>
									  <div class="form-group">
										<label for="mobile">手机号<label  style="color:red;font-size:12px;">*(必填)</label></label>
										<i class="fa fa-mobile"></i>
										<input type="mobile" class="form-control" id="mobile" name="mobile" >
										<label class="style2" style="color:red;font-size:12px;"></label>
									  </div>
									  <div class="form-group">
										<label for="password1">密码<label  style="color:red;font-size:12px;">*(必填)<label  style="color:#A9A6A6;font-size:12px;">密码必须由数字、字符、特殊字符三种中的两种组成，长度不能少于8位</label></label></label>
										<i class="fa fa-lock"></i>
										<input type="password" class="form-control" id="password1" name="rgrpsd" >
										<label class="style3" style="color:red;font-size:12px;"></label>
									  </div>
									  <div class="form-group">
										<label for="password2">确认密码<label  style="color:red;font-size:12px;">*(必填)</label></label>
										<i class="fa fa-check-square-o"></i>
										<input type="password" class="form-control" id="password2" >
										<label class="style4" style="color:red;font-size:12px;"></label>
									  </div>
									  <div class="form-actions">
										<label class="checkbox"> <input type="checkbox" class="uniform" value="">我同意 <a href="#">相关服务</a> 和 <a href="#">阅读条款</a></label>
										<button type="submit" id="sub" class="btn btn-success">注册</button>
									  </div>
								</form>
								<!-- SOCIAL REGISTER -->
								<div class="divide-20"></div>
								<div class="center">
									<strong>或者用第三方注册账户</strong>
								</div>
								<div class="divide-20"></div>
								<div class="social-login center">
									<a class="btn btn-primary btn-lg">
										<i class="fa fa-facebook"></i>
									</a>
									<a class="btn btn-info btn-lg">
										<i class="fa fa-twitter"></i>
									</a>
									<a class="btn btn-danger btn-lg">
										<i class="fa fa-google-plus"></i>
									</a>
								</div>
								<!-- /SOCIAL REGISTER -->
								<div class="login-helpers">
									<a href="#" onclick="swapScreen('login');return false;">返回登录</a> <br>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!--/REGISTER -->
			<!-- FORGOT PASSWORD -->
			<section id="forgot">
				<div class="container">
					<div class="row">
						<div class="col-md-4 col-md-offset-4">
							<div class="login-box-plain">
								<h2 class="bigintro">Reset Password</h2>
								<div class="divide-40"></div>
								<form role="form">
								  <div class="form-group">
									<label for="exampleInputEmail1">Enter your Email address</label>
									<i class="fa fa-envelope"></i>
									<input type="email" class="form-control" id="exampleInputEmail1" >
								  </div>
								  <div class="form-actions">
									<button type="submit" class="btn btn-info">Send Me Reset Instructions</button>
								  </div>
								</form>
								<div class="login-helpers">
									<a href="#" onclick="swapScreen('login');return false;">Back to Login</a> <br>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- FORGOT PASSWORD -->
	</section>
	<!--/PAGE -->
	<!-- JAVASCRIPTS -->
	<!-- Placed at the end of the document so the pages load faster -->
	<!-- JQUERY -->
	<script src="resources/admin/js/jquery/jquery-2.0.3.min.js"></script>
	<!-- JQUERY UI-->
	<script src="resources/admin/js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
	<!-- BOOTSTRAP -->
	<script src="resources/admin/bootstrap-dist/js/bootstrap.min.js"></script>


	<!-- UNIFORM -->
	<script type="text/javascript" src="resources/admin/js/uniform/jquery.uniform.min.js"></script>
	<!-- CUSTOM SCRIPT -->
	<script src="resources/admin/js/script.js"></script>
	<script>

		jQuery(document).ready(function() {

/*注册动态验证*/
		 var flag = {
                "email":false,
                "name":false,
                "password":false,
                "mobile":false

            };
		var rand = Math.random(1,5);
		/*昵称验证*/
			$('#name').blur(function(){

				/*获取用户昵称输入框的文本值*/
				var str=$('#name').val();

				if(str==0){
					$('.style').css('display','block');
					$('.style').text('*请输入昵称');

				}else{

						/*传入数据库进行查询，是否已被使用*/
						$.ajax({
							url: 'index.php?c=admin&a=prov&admin=1&name=4',
							type: 'post',
							data: {'str': str},
							success:function(a){
								if(a==1){
									$('.style').css('display','block');
									$('.style').text('*您输入的昵称已被使用');
								}else{
									flag.name=true;
									$('.style').css('display','block');
									$('.style').text('*恭喜昵称可用！');
								}

							}
						})
					}


			})

			$('#name').focus(function(){

				$('.style').css('display','none');

			})

		/*昵称验证*/

		/*邮箱验证*/

			$('#emaile').blur(function(){

				/*获取用户输入的文本值*/
				var strr=$('#emaile').val();
				var len=$('#emaile').val().length;
				if(len==0){

						    $('.style1').css('display','block');
							$('.style1').text('*邮箱不能为空');
							return;
	                        }
				/*匹配是否符合规则*/
			 	var re =  /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/;

				var result=re.exec(strr);
				if(result==null){

				    $('.style1').css('display','block');
					$('.style1').text('*请输入正确的邮箱');
				}else{

				   /*传入数据库进行查询，是否已被使用*/
					$.ajax({
						url: 'index.php?c=admin&a=prov&admin=1&username=5',
						type: 'post',
						data: {'str1': strr},
						success:function(a){
							if(a==1){
								$('.style1').css('display','block');
								$('.style1').text('*您输入的邮箱已被注册');
							}else{
								flag.email=true;
								$('.style1').css('display','block');
								$('.style1').text('恭喜你！该邮箱可用！');
							}

						}
					})
				}
			})
				$('#emaile').focus(function(){

				$('.style1').css('display','none');

			})

		/*邮箱验证*/

		/*密码验证*/
				$('#password1').blur(function(){
					var psd = $('#password1').val();
					if(psd==0){
						$('.style3').css('display','block');
						$('.style3').text('*密码不能为空');
						return;
					}
					var reg =/(?!^\d+$)(?!^[a-zA-Z]+$)(?!^[\!_#@]+$).{8,}/;
					var rel =reg.exec(psd);
					if(!rel){
						$('.style3').css('display','block');
						$('.style3').text('*密码格式不正确');
					}else{

						$('.style3').css('display','none');

					}
				})


				$('#password1').focus(function(){

				$('.style3').css('display','none');
				})



				$('#password2').blur(function(){
					var rpsd = $('#password2').val();
					if(rpsd==0){
						$('.style4').css('display','block');
						$('.style4').text('*此栏不能为空');
						return;
					}else if(rpsd!=$('#password1').val()){
						$('.style4').css('display','block');
						$('.style4').text('*密码不一致');
						return;
					}else{
						flag.password= true;
						$('.style4').css('display','none');
					}


				})

				$('#password2').focus(function(){

				$('.style4').css('display','none');
				})

		/*密码验证*/



		// /*用户名验证*/
		// 	$('#username').blur(function(){

		// 		/*获取用户输入的文本值*/
		// 		var strr=$('#username').val();

		// 		/*匹配是否符合规则*/
		// 	 	var re = /^[a-zA-z]\w{3,15}$/;

		// 		var result=re.exec(strr);
		// 		if(result==null){

		// 		    $('.style1').css('display','block');
		// 			$('.style1').text('请输入正确的用户名');
		// 		}else{
		// 		   /*传入数据库进行查询，是否已被使用*/
		// 			$.ajax({
		// 				url: 'index.php?c=admin&a=prov&admin=1&username='+rand,
		// 				type: 'post',
		// 				data: {'str1': strr},
		// 				success:function(a){
		// 					if(a==1){
		// 						$('.style1').css('display','block');
		// 						$('.style1').text('您输入的用户名已被使用');
		// 					}else{
		// 						$('.style1').css('display','block');
		// 						$('.style1').text('恭喜用户名可用！');
		// 					}

		// 				}
		// 			})
		// 		}

		// 	$('#username').focus(function(){

		// 		$('.style1').css('display','none');

		// 	})
		// })

		// /*用户名验证*/



		/*手机号码验证*/
			$('#mobile').blur(function(){
				/*获取用户输入手机的文本值*/
				var mobile=$('#mobile').val();
				if(mobile==0){

						    $('.style2').css('display','block');
							$('.style2').text('手机不能为空');
							return;
	                        }
				/*匹配是否符合规则,不符合规则返回null*/
			 	var re =/^1\d{10}$/;

				var result=re.exec(mobile);

				if(result==null){
					$('.style2').css('display','block');
					$('.style2').text('请输入正确的手机号码');
				}else{

					$('#mobile').focus(function(){

					$('.style2').css('display','none');

					})
				}
				flag.mobile=true;
			})
			$('#mobile').focus(function(){

					$('.style2').css('display','none');

					})

		/*手机号码验证*/

		/*提交事件*/
		$('#sub').click(function(){
			var ok = flag.mobile&&flag.name&&flag.email&&flag.password;
			if(ok==false){
				alert("注册信息未完善");
                //history.back();

            	return false;
			}
			$('form[name=register]').attr('action','index.php?c=admin&a=register&admin=1');



			return true;
		})
/*注册动态验证*/



/*点击验证码切换验证码*/
			$('.pin').click(function(){

				var aa = Math.random(1,6);
				var src = $(this).attr('src')+'&y='+aa;

				$(this).attr('src',src);
			})
/*点击验证码切换验证码*/

/*点击自动登录时自动勾上记住密码*/
			$('.checkbox input[name="auto"]').click(function(){

				$('.checkbox span').addClass('checked');//应为模板会自动生成一个span,先给它样式
				$('.checkbox input[name="check"]').prop('checked',true);
			})
/*点击自动登录时自动勾上记住密码*/

			App.setPage("login");  //Set current page
			App.init(); //Initialise plugins and elements
		});
	</script>
	<script type="text/javascript">
		function swapScreen(id) {
			jQuery('.visible').removeClass('visible animated fadeInUp');
			jQuery('#'+id).addClass('visible animated fadeInUp');
		}

	</script>
	<!-- /JAVASCRIPTS -->
</body>
</html>